<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="../js/jquery.min-3.3.1.js"></script>
    <script src="../js/push.js"></script>
</head>
<body>

</body>
</html>
<script>

    /**
     * 与服务器长链接通信
     */
    function connect() {
        let connection = new Push({
            url: 'ws://192.168.1.39:3133', // websocket地址
            app_key: '073f04b8b4ab99ba7349231b090750e4',
            auth: 'http://192.168.1.39:8787/plugin/webman/push/auth',
        });
        let channel = connection.subscribe('private-uniqid-1');

        test()

        // 普通消息
        channel.on('message', function (data) {
            console.info(data)
        });

        // 进度条
        channel.on('progress', function (data) {
            const type = data.type;
            const count = data.success + data.fail;
            const total = data.total;
            const percent = count + ' / ' + total;
            // 设置进度值
            element.progress('filter-progress', percent);
            document.getElementById('progress-layer-count').innerText = count;
            document.getElementById('progress-layer-total').innerText = total;
            // 捕获页面元素，弹出进度条
            layer.open({
                type: 1,
                id: 'progress-layer' + type,
                title: '任务进度条',
                area: '520px',
                shade: false, // 不显示遮罩
                content: $('#progress-layer-wrapper'), // 捕获的元素
                success: function (layero, index, that) {
                    // 弹层的最外层元素的 jQuery 对象
                    console.log(layero);
                    // 弹层的索引值
                    console.log(index);
                    // 弹层内部原型链中的 this --- 2.8+
                    console.log(that);
                },
                end: function () {
                    // layer.msg('关闭后的回调', {icon:6});
                }
            });
        });
        // 通知
        channel.on('notify', function (data) {
            switch (data.type) {
                case 'success':
                    notice.success(data.msg);
                    break;
                case 'error':
                    notice.error(data.msg);
                    break;
                case 'warning':
                    notice.warning(data.msg);
                    break;
                case 'info':
                    notice.info(data.msg);
                    break;
                default:
                    notice.clear();
                    break;
            }
        });
    }

    function test() {
        $.ajax({
            url: 'http://192.168.1.39:8787/plugin/webman/push/auth',
            type: 'POST',
            data: {channel_name: 'private-uniqid-817971658bd42417ea1', socket_id: 2.2},
            success: function (res) {
                console.log(res)
            },
            fail: function (err) {
                console.log(err)
            }
        })
    }

    connect();
    // test()
</script>
